import React, { Component, PropTypes } from 'react';
import { Relax } from 'iflux2'
import { Map, List } from 'immutable'

import { Table } from 'antd'
import goodsColumn  from '../constant/goodsColumn.js'
import OrderId from '../component/OrderId.js'
import OrderStep from '../component/OrderStep.js'
import OrderInfo from '../component/OrderInfo.js'
import PayDatail from '../component/PayDetail.js'
import { simpleSteps, advanceSteps} from '../constant/steps.js'
import { afterSaleStatusEnum } from '../constant/enum.js'
import { roleShape } from 'constant/PropTypes.js'
import { totalPriceQL } from '../ql.js';
import noop from 'util/noop'
@Relax
class AfterSaleDetail extends Component {

    static propTypes = {
        order:PropTypes.object
    };

    static defaultProps = {
        order:Map({}),//售后订单信息
        refund:Map({}),//退款信息，可退款，订单消息,退款方式
        returnedLog:Map({}),//退货单日志
        refundLog:Map({}),//退款单日志
        logs:List.of(),//日志记录
        messages:List([]),//卖家留言
        totalPrice:totalPriceQL,//总价
        auditOrder:noop,//审核订单函数
        receivedGoods:noop,//签收退货
        appendSellerMsg:noop,//添加留言
        //fetchRefundOrderInfo:noop,//查询退款信息，可退款
        confirmRefund:noop,//确认退款
        cancelOrder:noop,//取消订单，关闭售后订单
    }

    constructor(props){
        super(props);

        this.state = {
            //loading:false
        }
    }

    static contextTypes = {
        role:roleShape
    }
    render() {
        const { 
            order,//订单信息
            logs,//日志记录
            refund,//可退款信息
            returnedLog,
            refundLog,
            messages, //卖家留言列表
            totalPrice, //商品总价
            receivedGoods, //签收退货函数
            auditOrder, //审核订单函数
            appendSellerMsg, //追加留言
            cancelOrder,//关闭订单
            //fetchRefundOrderInfo, //查询可退款金额
            confirmRefund,
        }  = this.props;
       
        /**
         * 取消订单，拒绝通过的情况下步骤条不显示
         */
        let orderStep = null;
        if(order.get('state') !== afterSaleStatusEnum.CANCEL.value && order.get('state') !== afterSaleStatusEnum.UNAUDITED.value){
             //获取相应的步骤，当前所处的进度
            let {steps, current, status} = this.computeSteps(order.get('needReturn'),order.get('state'));
            orderStep = <OrderStep  steps={steps} current={current} status={status} />;
        }
        
        return ( 
            <div className="order-detail">
                <div className="order-bd-top" />
                <OrderId id={order.get('applyId')} tid={order.get('tid')} />
                {orderStep}
                <OrderInfo 
                    order={order}
                    role={this.context.role}
                    refund={refund}
                    returnedLog={returnedLog}
                    refundLog={refundLog}
                    messages={messages}
                    auditOrder={auditOrder}
                    receivedGoods={receivedGoods}
                    appendSellerMsg={appendSellerMsg}
                    confirmRefund={confirmRefund}
                    cancelOrder={cancelOrder}
                    //fetchRefundOrderInfo={fetchRefundOrderInfo}
                />
                <div className="buy-list">
                    <Table
                        rowKey='oid'
                        bordered
                        dataSource={order.get('itemList').toJS()}
                        columns={goodsColumn}
                        pagination={false}
                    />
                </div>
                
                <PayDatail 
                    totalPrice={totalPrice}
                    logs={logs}
                    // actualeRefund={order.get('actualeRfund')}
                    // applyRefund={order.get('applyRefund')}
                    order={order}
                />
            </div>
        );
    }
    /**
     * 根据是否退货，判断步骤数
     * 
     * 1.无退货，只需退款，分为3步
     * 2.有退货，需先退货，分4步
     * 
     * @param needReturn 是否需要退货 0:不需要，1:需要
     * @param state 进度状态
     * 
     * @return {steps:[],current:0}
     */
    computeSteps = (needReturn,state) => {

        let progress = {
            steps:[],
            current:0,
            status:"process"
        }
        if(needReturn === undefined){
            return progress;
        }
        progress.steps = needReturn === 1 ? advanceSteps.slice(0) : simpleSteps.slice(0);
        
        switch(state){
                //1
                case afterSaleStatusEnum.AUDITING.value:
                    progress.current = 0;
                    break;
                case afterSaleStatusEnum.AUDITED.value:
                case afterSaleStatusEnum.UNAUDITED.value:
                    progress.current = 1;
                    //审核不通过
                    if(state === afterSaleStatusEnum.UNAUDITED.value){
                        progress.steps[1].title = "审核不通过"
                        progress.status = 'error'
                    }
                    break;
                case afterSaleStatusEnum.RECEIVEED.value:
                    //这个分支，只有在需要退货的时候才有此状态。所以这里直接设置，不需要判断
                    progress.current = 2;
                    break;
                case afterSaleStatusEnum.REFUND.value:
                case afterSaleStatusEnum.FINISHED.value:
                case afterSaleStatusEnum.CANCEL.value:
                    //需要退款就2，需要退款退货就3，都是最后一个
                    progress.current = needReturn === 1 ? 3 : 2;
                    //审核不通过
                    if(state === afterSaleStatusEnum.CANCEL.value){
                        progress.steps[progress.steps.length - 1].title = "退款关闭"
                        progress.status = 'error'
                    }
                    break;
            }

        return progress;
        
    }
}


export default AfterSaleDetail;